﻿<!-- Produkt Actions -->
<div class="row">
	<div class="col-xs-2">
		<form id="add_category_form">
			<input type="hidden" name="c" value="Category">
			<input type="hidden" name="a" value="Detail">
			<input type="hidden" name="k_id" value="0">
		</form>
		<button type="button" class="btn btn-success" onClick="submitAjax('add_category_form', showKategorieDetail);">
			<span class="glyphicon glyphicon-plus"></span> <?= HTML::Write("Kategorie Hinzufügen"); ?>
		</button>
	</div>
</div>

<!-- Dummy Row für den Abstand -->
<div class="row">&nbsp;</div>

<div class="row">
	<div class="col-xs-3">
		<ul id="category_list" class="list-group select-menu">
		<?php
			foreach ($this->Kategorien as $kategorie)
			{
		?>
			<li id="kat_<?= $kategorie->ID; ?>" class="list-group-item" onClick="submitAjax('show_category_<?= $kategorie->ID; ?>', showKategorieDetail);">
			<form id="show_category_<?= $kategorie->ID; ?>">
				<input type="hidden" name="c" value="Category">
				<input type="hidden" name="a" value="Detail">
				<input type="hidden" name="k_id" value="<?= $kategorie->ID; ?>">
			</form>
				<!-- <span class="badge">14</span> -->
				<span id="kat_<?= $kategorie->ID; ?>_name"><?= HTML::Write($kategorie->Name); ?></span>
			</li>
		<?php
			}
		?>
		</ul>
	</div>
	
	<div class="col-xs-9">
		<div id="category_view" class="panel panel-default">
			
		</div>
	</div>
</div>

<script>
	$(document).ready(function() {
		<?php
		
			if (isset($_REQUEST["k_id"]) && $_REQUEST["k_id"] > 0)
			{
				echo "submitAjax('show_category_" . $_REQUEST["k_id"] . "', showKategorieDetail);";
			}
			else if (count($this->Kategorien) > 0)
			{
				echo "submitAjax('show_category_" . $this->Kategorien[0]->ID . "', showKategorieDetail);";
			}
		?>
	});

	function showKategorieDetail(viewResponse) {
		if (selectedKat)
			selectedKat.removeClass("selected");
			
		$('#category_view').html(viewResponse.view);
		currentKatId = viewResponse.data['id'];
		selectedKat = $("#kat_" + currentKatId);
		selectedKat.addClass("selected");
	}
</script>